<template>
  <div class="main_box" style="padding:10px">
    <div class="add_wrap">
      <el-form label-width="200px">
        <div class="tit">
          <h2>基础信息</h2>
          <el-button
            type="success"
            plain
            size="small"
            icon="fa fa-mail-forward"
            @click="returnList"
            >返回
          </el-button>
        </div>
        <el-row>
          <el-form-item label="订单编号:">
            <span>{{ dataInfo.orderNo }}</span>
          </el-form-item>
          <el-form-item label="商户:">
            <span>{{ dataInfo.businessName }}</span>
          </el-form-item>
          <el-form-item label="服务员:">
            <span>{{ dataInfo.waiterName }}</span>
          </el-form-item>
          <el-form-item label="二级推广员:">
            <span>{{ dataInfo.promoterName }}</span>
          </el-form-item>
          <el-form-item label="一级推广员:">
            <span>{{ dataInfo.firstPromoterName }}</span>
          </el-form-item>
          <el-form-item label="业务员:">
            <span>{{ dataInfo.saleName }}</span>
          </el-form-item>
          <el-form-item label="公司商户:">
            <span>{{ dataInfo.companyBusinessName }}</span>
          </el-form-item>
          <el-form-item label="分账状态:">
            <el-tag effect="dark" size="mini" :type="formatOrderSplitStates(dataInfo.orderSplitState)">
                {{ formatOrderSplitState(dataInfo.orderSplitState) }}
            </el-tag>
          </el-form-item>
          <el-form-item label="创建时间:">
            <span>{{ dataInfo.createDate }}</span>
          </el-form-item>
          <el-form-item label="修改人:">
            <span>{{ dataInfo.modifyUserName }}</span>
          </el-form-item>
          <el-form-item label="修改时间:">
            <span>{{ dataInfo.modifyDate }}</span>
          </el-form-item>
          <el-form-item label="备注:">
            <span>{{ dataInfo.remark }}</span>
          </el-form-item>
        </el-row>

        <div class="tit">
          <h2>金额信息</h2>
        </div>
        <el-row>
          <el-form-item label="分账金额:">
            <span>{{ dataInfo.splitAmount }}</span>
          </el-form-item>
          <el-form-item label="商户收益金额:">
            <span>{{ dataInfo.businessGain }}</span>
          </el-form-item>
          <el-form-item label="商户包装费收益金额:">
            <span>{{ dataInfo.businessPackageGain }}</span>
          </el-form-item>
          <el-form-item label="商户补贴金额:">
            <span>{{ dataInfo.businessOut }}</span>
          </el-form-item>
          <el-form-item label="服务员收益金额:">
            <span>{{ dataInfo.waiterGain }}</span>
          </el-form-item>
          <el-form-item label="二级推广收益金额:">
            <span>{{ dataInfo.promoterGain }}</span>
          </el-form-item>
          <el-form-item label="一级推广收益金额:">
            <span>{{ dataInfo.firstPromoterGain }}</span>
          </el-form-item>
          <el-form-item label="业务员收益金额:">
            <span>{{ dataInfo.saleGain }}</span>
          </el-form-item>
          <el-form-item label="补贴翼码金额:">
            <span>{{ dataInfo.subsidyYmAmount }}</span>
          </el-form-item>
          <el-form-item label="公司包装费收益(商户):">
            <span>{{ dataInfo.platformPackageGain }}</span>
          </el-form-item>
          <el-form-item label="公司收益金额(商户):">
            <span>{{ dataInfo.platformGain }}</span>
          </el-form-item>
          <el-form-item label="公司基础补贴金额(商户):">
            <span>{{ dataInfo.platformReserveGain }}</span>
          </el-form-item>
          <el-form-item label="公司活动补贴金额(商户):">
            <span>{{ dataInfo.platformSupplyGain }}</span>
          </el-form-item>
          <el-form-item label="公司配送费补贴金额(商户):">
            <span>{{ dataInfo.platformDeliveryFeeSubsidy }}</span>
          </el-form-item>
          <el-form-item label="公司收益金额(业务员):">
            <span>{{ dataInfo.salePlatformGain }}</span>
          </el-form-item>
          <el-form-item label="公司基础补贴金额(业务员):">
            <span>{{ dataInfo.salePlatformReserveOut }}</span>
          </el-form-item>
          <el-form-item label="公司活动补贴金额(业务员):">
            <span>{{ dataInfo.salePlatformSupplyOut }}</span>
          </el-form-item>
          <el-form-item label="公司配送费补贴金额(业务员):">
            <span>{{ dataInfo.saleDeliveryFeeSubsidy }}</span>
          </el-form-item>
          <el-form-item label="公司包装费收益(业务员):">
            <span>{{ dataInfo.salePlatformPackageGain }}</span>
          </el-form-item>
        </el-row>
        <div class="tit">
          <h2>分账记录</h2>
        </div>
        <el-table
          :data="list"
          max-height="400"
          style="max-width: 1400px;width:1400px"
          :fit="true"
          highlight-current-row
          element-loading-text="数据加载中，请稍后..."
          empty-text="对不起，没有找到相关数据！"
        >
          <el-table-column type="index" label="序号" align="center" width="80">
          </el-table-column>
          <el-table-column label="分账对象" align="center" width="80">
            <template slot-scope="scope">
              <div>
                {{ scope.row.splitObjects == 1 ? "自己" : "公司" }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            label="分账状态"
            prop="splitState"
            align="center"
            width="170"
          >
            <template slot-scope="scope">
              <el-tag
                size="mini"
                effect="dark"
                :type="formatSplitStates(scope.row.splitState)"
              >
                {{ formatSplitState(scope.row.splitState) }}
              </el-tag>
            </template>
          </el-table-column>
          <el-table-column
            label="分账日期"
            prop="splitDate"
            align="center"
            width="170"
          >
          </el-table-column>
          <el-table-column label="用户类型" align="center" width="120">
            <template slot-scope="scope">
              <div>
                {{ formatSplitType(scope.row.splitType) }}
              </div>
            </template>
          </el-table-column>

          <el-table-column prop="userGain" label="用户收益金额" align="center">
          </el-table-column>

          <el-table-column
            prop="beeperAmount"
            label="呼叫器充值订单取值金额"
            width="130"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="selfOrderAmount"
            label="自订单取值金额"
            width="130"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="lastAmount"
            label="差价订单取值金额(微信支付的差价)"
            width="130"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="subsidyAmount"
            label="补贴订单取值金额"
            align="center"
            width="130"
          >
          </el-table-column>
          <el-table-column
            label="分账来源类型"
            align="center"
            width="140"
          >
            <template slot-scope="scope">
              <div>
                {{ scope.row.subsidyAmount>0 ? "补贴订单" : "自订单" }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
    </div>
  </div>
</template>

<script>
import OrderSplitApi from "@/api/account/orderSplit";
export default {
  data() {
    return {
      dataInfo: {},
      list: [],
      splitStateList: [
        { id: 1, name: "待分账" },
        { id: 5, name: "分账成功" },
        { id: 10, name: "分账失败" }
      ]
    };
  },
  computed: {},
  mounted() {
    this.getData();
  },
  methods: {
    getData() {
      OrderSplitApi.getOrderSplit({ id: this.$route.query.id }).then(res => {
        this.dataInfo = res.data;
        this.list = res.data.list || [];
      });
    },
    formatOrderSplitState(val) {
            switch (val) {
                case 1:
                    return "分帐中"
                case 2:
                    return "分账中(部分成功)"
                case 3:
                    return "分账中(存在失败)"
                case 4:
                    return "分账结束(存在失败)"
                case 5:
                    return "分账完成"
            }
        },
        formatOrderSplitStates(val) {
            switch (val) {
                case 1:
                    return ""
                case 2:
                    return "info"
                case 3:
                    return "warning"
                case 4:
                    return "danger"
                case 5:
                    return "success"

            }
        },
    formatSplitState(val) {
      switch (val) {
        case 1:
          return "待分账";
        case 5:
          return "已分账";
        case 10:
          return "分账失败";
      }
    },
    formatSplitStates(val) {
      switch (val) {
        case 1:
          return "";
        case 5:
          return "success";
        case 10:
          return "danger";
      }
    },
    formatSplitType(val) {
      switch (val) {
        case 0:
          return "平台商户";
        case 1:
          return "商户";
        case 2:
          return "服务员";
        case 3:
          return "业务员";
        case 4:
          return "二级推广员";
        case 5:
          return "一级推广员";
        case 6:
          return "业务员商户";
      }
    },
    formatResultId(val) {
      switch (val) {
        case 0:
          return "成功";
        case 1:
          return "处理它";
        case 2:
          return "其它";
      }
    },
    formatResultIds(val) {
      switch (val) {
        case 0:
          return "success";
        case 1:
          return "primary";
        case 2:
          return "warning";
      }
    },
    returnList() {
      this.$store.dispatch("delView", this.$route);
      this.$router.back();
    }
  }
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/views/add.scss";
</style>
